{extend name="public/base"}

{block name="title"}就行天下-首页{/block}

{block name="style"}
<link rel="stylesheet" href="__STATIC__/home/css/index.css" />
<style>
    .amap-icon {
        z-index: 3;
    }
    .amap-icon img {
        width: 30px;
        height: 30px;
        border-radius: 100%;
        box-shadow: 0 3px 7px rgba(69, 68, 68, .35);
    }
    .amap-marker-label {
        top: 6px !important;
        left: 20px !important;
        box-sizing: border-box;
        border: 1px solid #e8e8e8;
        line-height: 15px;
        padding-left: 15px;
        padding-right: 10px;
        box-shadow: 0 3px 7px rgba(69, 68, 68, .35);
    }

    div.info-top {
        position: relative;
        background: none repeat scroll 0 0 #F9F9F9;
        border-bottom: 1px solid #CCC;
        border-radius: 5px 5px 0 0;
    }
    div.info-top div {
        display: inline-block;
        color: #333333;
        font-size: 14px;
        font-weight: bold;
        line-height: 31px;
        padding: 0 10px;
    }
    div.info-top img {
        position: absolute;
        top: 10px;
        right: 10px;
        transition-duration: 0.25s;
    }
    div.info-top img:hover {
        box-shadow: 0px 0px 5px #000;
    }
    div.info-middle {
        font-size: 12px;
        padding: 6px;
        line-height: 20px;
    }
    div.info-bottom {
        height: 0px;
        width: 100%;
        clear: both;
        text-align: center;
    }
    div.info-bottom img {
        position: relative;
        z-index: 104;
    }
    span {
        margin-left: 5px;
        /*font-size: 11px;*/
    }
    .info-middle img {
        float: left;
        margin-right: 6px;
    }
    .amap-info-content img {
        width: auto;
    }
    .shop-logo {
        width: 76px !important;
        height: 76px !important;
    }
    .shop-info {
        float: right;
        border: 1px solid #ddd;
        padding: 2px 10px;
        border-radius: 5px;
        box-shadow: 0 3px 7px rgba(69, 68, 68, .35);
    }
    .amap-maps .info-top {
        background: #fff;
    }
</style>
{/block}

{block name="main"}
<div class="pageControl login index">
    <div class="main-top"></div>
    <div class="msui_nav msui_navTop noBorder">
        <a class="msui_navTop-back scanQRCode" href="javascript:;"><i class="micon-scan"></i></a>
        <h1 class="msui_navTop-title">就行天下</h1>
        <a href="" class="msui_navTop-right msui_navTop-cnav"><i class="micon-cnav"></i></a>
    </div>
    <div class="msui_menu">
        <div class="msui_menu-mask">
            <ul class="msui_menu-bd js-menu">
                {volist name="data.category" id="vo"}
                <li class="msui_menu-li" data-tab="{$i - 1}"><a class="msui_menu-list {eq name='i' value='1'}msui_tabMenu-active{/eq} fs08 cl-6666" data-id="{$vo.id}">{$vo.name}</a></li>
                {/volist}
                <li class="msui_menu-li"><a href="{:url('friend/index')}" class="msui_menu-list  fs08 cl-6666" data-status="4">约酒交友</a></li>
                <!-- 用于动画的层 -->
                <div id="line" class="weui-baseline"></div>
            </ul>
        </div>
    </div>
    <div class="map_address">定位中...</div>
    <div id="map"></div>
    <input type="hidden" name="lat" value="">
    <input type="hidden" name="lng" value="">
    <a href="javascript:;" id="drink" class="index-btn cl-f fs075">我要喝酒</a>
</div>
<!--下单-->
<div id="orders"  class="weui-popup__container popup-bottom">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
        <div class="ordersMain">
            <div class="orders-title">
                <h1 class="title cl-3333 fs075 text-center">喝酒时间</h1>
                <input type="text" class="weui-input fs065 text-center" id="time" value="" readonly>
            </div>
            <div class="modal-content weui-cells_checkbox js-choose">
                <div class="weui-cell">
                    <div class="weui-cell__hd">
                        <img src="__STATIC__/home/images/cancle.png" alt="">
                    </div>
                    <div class="weui-cell__bd">
                        <input type="text" class="weui-input msg" placeholder="我的详细需求">
                    </div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__hd">
                        <img src="__STATIC__/home/images/consignee.png" alt="">
                    </div>
                    <div class="weui-cell__bd">
                        <input type="text" class="weui-input consignee" placeholder="收货人姓名">
                    </div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__hd">
                        <img src="__STATIC__/home/images/mobile.png" alt="">
                    </div>
                    <div class="weui-cell__bd">
                        <input type="text" class="weui-input mobile" placeholder="联系电话" value="{$Think.session.member_username}">
                    </div>
                </div>
                <div class="weui-cell-two">
                    <input type="text" class="fs07 visit weui-input text-center" value="送酒上门">
                    <a href="javascript:;" class="fs07 jxjg">就行酒柜</a>
                </div>
            </div>
        </div>
        <a href="javascript:;" id="orders-btn" class="order-btn cl-f fs075">确认下单</a>
    </div>
</div>
<div id="shop_info" class="weui-popup__container popup-bottom" data-shop-id="" style="height: auto">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
        <div class="toolbar">
            <div class="toolbar-inner">
                <h1 class="title cl-3333 fs075">店鋪</h1>
                <a href="javascript:;" class="cl-666 picker-button close close-popup">
                    <i class="icon iconfont icon-guanbi1"></i>
                </a>
            </div>
        </div>
        <div class="modal-content fs06 bg-fff" style="padding-bottom: 1rem;  max-height: 85vh" >

        </div>
    </div>
</div>
<div id="shop_goods" class="weui-popup__container popup-bottom">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
        <div class="toolbar">
            <div class="toolbar-inner">
                <h1 class="title cl-3333 fs075">商品列表</h1>
                <a href="javascript:;" class="cl-666 picker-button close show-shop-info">
                    <i class="icon iconfont icon-guanbi1"></i>
                </a>
            </div>
        </div>
        <div class="modal-content fs06 bg-fff" style="padding-bottom: 1rem;  max-height: 85vh" >
            <p style="text-align: center; margin-top: 4rem;">商品列表</p>
        </div>
    </div>
</div>
<div id="shop_comment" class="weui-popup__container popup-bottom">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
        <div class="toolbar">
            <div class="toolbar-inner">
                <h1 class="title cl-3333 fs075">評論列表</h1>
                <a href="javascript:;" class="cl-666 picker-button close show-shop-info">
                    <i class="icon iconfont icon-guanbi1"></i>
                </a>
            </div>
        </div>
        <div class="modal-content fs06 bg-fff" style="padding-bottom: 1rem; max-height: 85vh" >
            <p style="text-align: center; margin-top: 4rem;">評論列表</p>
        </div>
    </div>
</div>
<div id="container"></div>
{/block}

{block name="javascript"}
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=79d3994d99486314dbfddc26b4445dd2"></script>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=79d3994d99486314dbfddc26b4445dd2&plugin=AMap.ToolBar"></script>
<script src="__STATIC__/home/js/map.js?v={php} echo time();{/php}"></script>
<script src="//webapi.amap.com/ui/1.0/main.js?v=1.0.10"></script>
<script src="__STATIC__/home/jquery_weui/js/swiper.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
    $(function() {
        FastClick.attach(document.body);
    });
</script>
<script>
    SCOPE.param_lat = '{$lat|default=""}';
    SCOPE.param_lng = '{$lng|default=""}';
    if (SCOPE.param_lat && SCOPE.param_lng) {
        console.log('aa');
        sessionStorage.param_lat = SCOPE.param_lat;
        sessionStorage.param_lng = SCOPE.param_lng;
    } else {
        console.log('bb');
        sessionStorage.removeItem('param_lat');
        sessionStorage.removeItem('param_lng');
//        sessionStorage.param_lat = sessionStorage.param_lng = null;
    }

    SCOPE.index_product_list = {};
    SCOPE.index_get_shop_list_url = '{:url("get_shop_list_by_category_and_lat_lng")}';

    //    配送方式
    $('.visit').picker({
        toolbarCloseText:'确认',
        title: "请选择配送方式",
        cols: [
            {
                textAlign: 'center',
                values: ['送酒上门', '到店取酒']
            }
        ]
    });

    //    选择时间
    $("#time").datetimePicker();
    //    时间表示方式
    function getNowFormatDate() {
        var date=new Date();
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
            month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
            strDate = "0" + strDate;
        }
        var currentdate = date.getFullYear() + '-' + month + '-' + strDate
            + " " + date.getHours() + ':' + date.getMinutes();
        return currentdate;
    }
    $(function() {
//        时间初始显示
        $('#time').val(getNowFormatDate());

        $('#drink').click(function (e) {
            e.preventDefault();
            $('#orders').popup();
        });

        // 查看店鋪詳情
        $(document).on('click', '.shop-info', function (e) {
            e.preventDefault();
            var _shop_id = $(this).data('shop-id');
            $("#shop_info").popup();
            if ($("#shop_info").data('shop-id') != _shop_id) {
                $("#shop_info").find('.modal-content').html('<p style="text-align: center; margin-top: 4rem;">数据加载中...</p>');
                $("#shop_info").data('shop-id', _shop_id);
                $.ajax({
                    type : 'GET',
                    url : '{:url("get_shop_info")}',
                    data : {
                        id : _shop_id
                    },
                    dataType : 'json',
                    success : function (msg) {
                        if (msg.code == 200) {
                            $("#shop_info").find('.modal-content').html(msg.tpl);
                        } else {
                            $.toptip(msg.msg, 'error');
                        }
                    }
                });
            }
        });
        
        // 切換導航分類
        $(".msui_menu-li").click(function () {
            get_shop_list_by_category($(this).find('a'), SCOPE.map);
        });

        // 點擊查看店鋪經營分類
        $(document).on('click', ".shop-goods",function () {
            SCOPE.index_product_list.page = 1;
            SCOPE.index_product_list.category_id = $(this).data('category-id');
            SCOPE.index_product_list.shop_id = $(this).data('shop-id');
            get_product_list();
            $("#shop_goods").popup();
        });

        // 點擊查看店鋪全部評論
        $(document).on('click', ".shop-comment",function (e) {
            e.preventDefault();
            var _shop_id = $(this).data('shop-id');
            $("#shop_comment").popup();
            if ($("#shop-comment").data('shop-id') != _shop_id) {
                $("#shop_comment").find('.modal-content').html('<p style="text-align: center; margin-top: 4rem;">数据加载中...</p>');
                $("#shop_comment").data('shop-id', _shop_id);
                $.ajax({
                    type : 'GET',
                    url : '{:url("get_shop_comment")}',
                    data : {
                        id : _shop_id
                    },
                    dataType : 'json',
                    success : function (msg) {
                        if (msg.code == 200) {
                            $("#shop_comment").find('.modal-content').html(msg.tpl);
                        } else {
                            $.toptip(msg.msg, 'error');
                        }
                    }
                });
            }
        });

        // 點擊查看店鋪全部評論
        $(document).on('click', ".show-shop-info",function () {
            $("#shop_info").popup();
        });

        // 点击确认下单
        $("#orders-btn").click(function () {
            $.showLoading();
            $.ajax({
                type : 'POST',
                url : '{:url("create_demand_order")}',
                data : {
                    category_id : $(".msui_tabMenu-active").data('id'),
                    drink_time : $("#time").val(),
                    consignment_type : $(".visit").val(),
                    msg : $(".msg").val(),
                    consignee : $(".consignee").val(),
                    mobile : $(".mobile").val(),
                    address : $(".map_address").text(),
                    lat : $("input[name='lat']").val(),
                    lng : $("input[name='lng']").val()
                },
                dataType : 'json',
                success : function (msg) {
                    $.hideLoading();
                    if (msg.code == 200) {
                        $.closePopup();
                        $.modal({
                            title: "下单成功",
                            text: "您的需求已经提交成功，请耐心等待商家为您服务！！",
                            buttons: [
                                { text: "查看订单", onClick: function(){ window.location.href = '{:url("order/index")}';} },
                                { text: "确定", className: "default", onClick: function(){ } },
                            ]
                        });
                    } else {
                        $.toptip(msg.msg, 'error');
                    }
                }
            });
        });

        // 点击就行酒柜
        $('.jxjg').click(function () {
            window.location.href = '{:url("shop_list")}?lat=' + $('input[name="lat"]').val() + '&lng=' + $('input[name="lng"]').val() + '&ad=' + $('.map_address').text();
        });

        $("#shop_goods .modal-content").scroll(function () {
            console.log(($("#shop_goods .modal-content").height() - $("#shop_goods .modal-content").scrollTop));
            if ((($("#shop_goods .modal-content").height() - $("#shop_goods .modal-content").scrollTop) < 50) &&  SCOPE.index_product_list.is_more) {
                get_product_list();
            }
        });
    });

    function get_product_list() {
        $.get('{:url("product/get_product_list")}', {category_id : SCOPE.index_product_list.category_id, shop_id : SCOPE.index_product_list.shop_id}, function (msg) {
            if (SCOPE.index_product_list.page == 1) {
                $("#shop_goods .modal-content").html(msg.tpl);
            } else {
                $("#shop_goods .modal-content").append(msg.tpl);
            }

            // 计算是否还有更多数据
            if (msg.data.is_more > 0) {
                SCOPE.index_product_list.is_more = true;
            }
            SCOPE.index_product_list.page++;
        }, 'json')
    }

</script>

{notempty name="signPackage"}
<script>

    wx.config({
            //debug: true,
            appId: '{$signPackage.appId}',
            timestamp: {$signPackage.timestamp},
            nonceStr: '{$signPackage.nonceStr}',
            signature: '{$signPackage.signature}',
            jsApiList: [
            // 所有要调用的 API 都要加到这个列表中
            'checkJsApi',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'hideMenuItems',
            'scanQRCode'
        ]
    });

    wx.ready(function () {
        // 在这里调用 API
        wx.checkJsApi({
            jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'hideMenuItems', 'scanQRCode'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
            success: function (res) {
//                alert(res.checkResult.onMenuShareTimeline);
//                alert(res.errMsg);
                //console.log(res);
                // 以键值对的形式返回，可用的api值true，不可用为false
                // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
            }
        });
    });

    $(".scanQRCode").click(function () {
        wx.scanQRCode({
            needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
            desc : 'scanQRCode desc',
            scanType: ["qrCode"], // 可以指定扫二维码还是一维码，默认二者都有
            success: function (res) {
                var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
                if (result.match('^((https|http)?:\/\/)[^\s]+')) // 有图片检查是否有http://
                {
                    window.location.href = result;
                } else {
                    alert('扫码结果为：' + result);
                }
            }
        });
    });
</script>
{/notempty}
{/block}